<template>
  <view>
    <view class="">
      <text class="menu" :class="{mactive:current==d.index}" @click="changeCurrent(d.index)"
        v-for="d in menus">{{d.text}}</text>
    </view>

    <view class="info" :class="{active:current==0}">
      我的收藏
    </view>
    <view class="info" :class="{active:current==1}">
      我的历史
    </view>
    <view class="info" :class="{active:current==2}">
      我的点赞
    </view>
  </view>
</template>

<script setup>
  import {
    ref
  } from 'vue'

  import {
    onLoad
  } from '@dcloudio/uni-app'

  onLoad((event) => {
    current.value = event.current ? event.current : 0
  })

  const menus = ref([{
      index: 0,
      text: '我的收藏'
    },
    {
      index: 1,
      text: '我的历史'
    },
    {
      index: 2,
      text: '我的点赞'
    }
  ])

  const current = ref(0)

  const changeCurrent = (c) => {
    // current.value = c
    uni.navigateTo({
      url: '/pages/test/demo1?current=' + c
    })
  }
</script>

<style scoped>
  .menu {
    display: inline-block;
    margin: 0.1rem;
    padding: 0.1rem;
    border: 1px solid #ff0000;
  }

  .info {
    display: none;
  }

  .active {
    display: block;
  }

  .mactive {
    background-color: #ff0000;
    color: #fff;
  }
</style>